<template>
    <div class="after-sales-service">
      <h1>售后服务</h1>
  
      <!-- 售后服务介绍 -->
      <section class="service-introduction">
        <h2>售后服务简介</h2>
        <p>我们致力于提供优质的售后服务，确保您在使用过程中的满意度和便利性。以下是我们的售后服务政策和处理流程：</p>
      </section>
  
      <!-- 服务类型 -->
      <section class="service-types">
        <h2>服务类型</h2>
        <p>我们提供以下几种售后服务类型：</p>
        <ul>
          <li><strong>退货退款</strong>: 如对商品不满意，您可以在一定期限内申请退货退款。</li>
          <li><strong>换货服务</strong>: 商品出现质量问题或者非人为损坏的情况下，我们提供换货服务。</li>
          <li><strong>维修服务</strong>: 针对部分商品，我们提供维修服务，保障您的使用体验。</li>
        </ul>
      </section>
  
      <!-- 售后流程 -->
      <section class="service-process">
        <h2>售后处理流程</h2>
        <p>如需申请售后服务，请按以下步骤进行：</p>
        <ol>
          <li>联系客服：通过电话、邮件或在线客服联系我们的客服团队。</li>
          <li>提交申请：请详细描述问题，并提供相关订单信息和商品照片。</li>
          <li>审核处理：我们的售后团队将在收到申请后进行审核，处理结果将在一定时间内告知您。</li>
          <li>完成服务：根据具体情况，我们会为您提供退款、换货或维修服务。</li>
        </ol>
      </section>
  
      <!-- 注意事项 -->
      <section class="service-notes">
        <h2>注意事项</h2>
        <ul>
          <li>请在收到商品后尽快检查，避免超过售后期限。</li>
          <li>退货时请保持商品的完好和原包装，避免影响退货过程。</li>
          <li>根据具体问题，售后服务的处理时间可能会有所不同，请耐心等待。</li>
        </ul>
      </section>
    </div>
  </template>
  
  <script setup>
  </script>
  
  <style scoped>
  .after-sales-service {
    max-width: 800px;
    margin: 0 auto;
    padding: 20px;
  }
  
  h1, h2 {
    color: #333;
  }
  
  section {
    margin-bottom: 30px;
  }
  
  h2 {
    font-size: 1.5em;
    margin-bottom: 10px;
  }
  
  ul, ol {
    line-height: 1.6;
    margin-left: 20px;
  }
  
  ul li, ol li {
    margin-bottom: 10px;
  }
  </style>
  